<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title></title>
<style>
	.title{
		color:#0000FF;
		font-weight:bold;
		font-size:14px;	
	}
	.content{
		font-size:12px;	
	}
</style>
</head>

<body>
<div align="center"><h2><font color="#FF0000">使用说明</font></h2></div>
<h3>界面元素说明</h3>
<ol>
<li><span class="title">状态栏 </span><span class="content">X,Y (鼠标位置)N (节点数)L(直线数)FX,FY (节点位置)</span></li>
<li><span class="title">连续添加控件 </span><span class="content">选中后，可以连续添加控件</span></li>
<li><span class="title">显示直线距离 </span><span class="content">选中后，会显示直线的长度</span></li>
<li><span class="title">是否有向图</span><span class="content"> 选中后，表示有向图，否则为无向图</span></li>
<li><span class="title">正常 </span><span class="content">该状态下，可以选中节点</span></li>
<li><span class="title">添加节点</span><span class="content"> 该状态下可以在画板中左击添加节点</span></li>
<li><span class="title">添加直线 </span><span class="content">该状态下可以在画板中用鼠标添加直线</span></li>
<li><span class="title">移动节点 </span><span class="content">该状态下可以在画板中拖动节点</span></li>
<li><span class="title">重置Runner </span><span class="content">点击将会重置Runner到第一个节点</span></li>
<li><span class="title">运行/停止 </span><span class="content">点击将会运行Runner(前提是isRunnable=true)，如果正在运行，点击将停止</span></li>
<li><span class="title">清空所有 </span><span class="content">点击将清空所有节点</span></li>
<li><span class="title">清除节点关联线 </span><span class="content">在选中节点的前提下，点击该按钮，将删除与选中节点连接的直线</span></li>
</ol>
<h3>怎样准备一个可运行的图</h3>
<ol>
<li>选中<span class="title">添加节点</span>，在画板中添加适量节点</li>
<li>选中<span class="title">添加直线</span>，在画板中两个节点间拖拽添加适量直线</li>
<li>点击<span class="title">重置Runner</span>，在画板中第一个节点上将看到Runner</li>
<li>选中<span class="title">正常</span>，再点击Runner所在节点之外的其他节点</li>
<li>至此，起点和终点设置完毕</li>
<li>点击<span class="title">运行</span>，如果起点和终点间存在通路，将能看到Runner从起点走向终点</li>
</ol>
<h3>菜单</h3>
<ol>
<li><span class="title">文件-导入</span>，选择json文件导入节点信息到画板</li>
<li><span class="title">文件-导出</span>，将当前画板中节点信息导出</li>
</ol>
<h3>注意</h3>
<ol>
<li>如果运行的条件不满足，点击<span class="title">运行</span>时，右下角状态图标将变灰</li>
<li>如果想要删除某个节点，鼠标移至节点上方，右键点击该节点即可</li>
</ol>
<h3>示例</h3>
<img alt="1_zh_CN.png" src="1_zh_CN.png"/><br/>
<img alt="2_zh_CN.png" src="2_zh_CN.png"/><br/>
<img alt="3_zh_CN.png" src="3_zh_CN.png"/><br/>
<img alt="4_zh_CN.png" src="4_zh_CN.png"/><br/>
<img alt="5_zh_CN.png" src="5_zh_CN.png"/><br/>
</body>
</html>
